body {
    margin: 0px;
    padding: 0px;
    border: 0px;

    width: 100%;
    height: 100%;
    background-color: green;
}

.container {

    height: 80%;

    margin-left: auto;
    margin-right: auto;
    margin-top: 10%;

    > div:first-child {
        margin-left: 10%;
    }

    .item {
        float: left;
        position: relative;
        width: 20%;
        box-sizing: border-box;
        text-align: center;
        background-image: url(lanrenzhijia1.png);
        margin-left: 4px;
        height: 437px;
        z-index: 1;

        .cover {
            position: absolute;
            width: 100%;
            background-color: white;
            height: 200px;
            z-index: -1;

            transition: all 0.25s linear;

            &:hover {
                height: 100px;
                transform: rotate(180deg);
            }
        }

        svg{
            width: 100%;
            height: 200px;
            fill: white;
            path{
                d:"m0 0 L100% 0 L200 200 L50% 150 L0 200 Z"
            }
        }

        .title {
            margin-top: 50px;
        }
        .content {
            margin-top: 10px;
        }


        &:nth-child(2){
            border: 1px solid grey;

            -webkit-transition:all 0.3s ease;
            transition:all 0.3s ease;

            &:hover{
                border-radius: 50%;
            }
        }
    }
}

@-webkit-keyframes border {
    0%,100%{
        border-radius: 0;
    }
    50%{
        border-radius: 50%;
    }
 }